/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<      >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<            >>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<      卡片      >>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<            >>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<      >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

body.CoreBody .CoreWeb-EasyCard {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  box-sizing: border-box;
  vertical-align: top;

  /* ============================== 隐藏内边距 ============================== */
  &.no-padding > .CoreWeb-EasyCard-panel {
    padding: 0;

    /* —————————————————————————————— 视图区 —————————————————————————————— */
    > .CoreWeb-EasyCard-panel-no-scroll,
    > .CoreWeb-EasyScroll > .__panel > .__view {
      padding: 0;
    }
  }
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<      >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<            >>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<      面板      >>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<            >>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<      >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

.CoreBody .CoreWeb-EasyCard-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px 0;
  box-sizing: border-box;
  border-radius: 10px;
  color: var(--Black8);
  background: var(--White);
  overflow: hidden;

  /* ============================== 页头 ============================== */
  &-header {
    padding: 0 20px 20px;
  }

  /* ============================== 页脚 ============================== */
  &-footer {
    padding: 20px 20px 0;
  }

  /* ============================== 无滚动 ============================== */
  &-no-scroll {
    flex: 1;
    padding: 0 20px;
  }

  /* ============================== 标题 ============================== */
  &-title {
    position: relative;
    line-height: 1;
    margin-bottom: 22px;
    font-size: 18px;
    font-weight: bold;

    /* —————————————————————————————— 标题右侧 —————————————————————————————— */
    > div {
      position: absolute;
      top: 0;
      right: 0;
    }

    /* —————————————————————————————— 有标题的内容 —————————————————————————————— */
    + .CoreWeb-EasyCard-panel-body {
      height: calc(100% - 40px);
    }
  }

  /* ============================== 内容 ============================== */
  &-body {
    position: relative;
    height: 100%;
    box-sizing: border-box;
  }

  /* ============================== 滚动条 ============================== */
  > .CoreWeb-EasyScroll {
    flex: 1;

    /* —————————————————————————————— 可视区域 —————————————————————————————— */
    > .__panel > .__view {
      padding: 0 20px;
    }

    /* —————————————————————————————— 垂直滚动条 —————————————————————————————— */
    > .__rail-is-vertical {
      top: 5px !important;
      bottom: 5px !important;
    }

    /* —————————————————————————————— 水平滚动条 —————————————————————————————— */
    > .__rail-is-horizontal {
      left: 5px !important;
      right: 5px !important;
    }
  }
}
